/***************************************************************************
*   Copyright (C) 2011 by Chuck Gao & Alex Liu                             *
*                                                                          *
*   This program is free software: you can redistribute it and/or modify   *
*   it under the terms of the GNU General Public License as published by   *
*   the Free Software Foundation, either version 3 of the License, or      *
*   (at your option) any later version.                                    *
*                                                                          *
*   This program is distributed in the hope that it will be useful,        *
*   but WITHOUT ANY WARRANTY; without even the implied warranty of         *
*   MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the          *
*   GNU General Public License for more details.                           *
*                                                                          *
*   You should have received a copy of the GNU General Public License      *
*   along with this program.  If not, see <http://www.gnu.org/licenses/>.  *
*                                                                          *
*   Contact author: chuckgao.cg@gmail.com                                  *
*                   alex2202375@gmail.com                                  *
***************************************************************************/

import QtQuick 1.0

Rectangle {
    id: ingredientList
    width: 360
    height: 600
    color: Qt.rgba(40,100,150,0.2)
    border.color: Qt.rgba(255,255,255,0.2)
    border.width: 2
    radius: 20

    property int leftMargin: 2

    Column {
        anchors.centerIn: parent
        anchors.margins: leftMargin

        Item {
            id: ingredientToolBar
            width: ingredientList.width - leftMargin * 2
            height: 40

            Row {
                Text {
                    width: 80
                    height: 40
                    anchors.verticalCenter: parent.verticalCenter
                    font.pointSize: 10
                    horizontalAlignment: Text.AlignHCenter
                    verticalAlignment: Text.AlignVCenter
                    text: "导出"
                    color: "white"
                }

                Text {
                    width: 80
                    height: 40
                    anchors.verticalCenter: parent.verticalCenter
                    font.pointSize: 10
                    horizontalAlignment: Text.AlignHCenter
                    verticalAlignment: Text.AlignVCenter
                    text: "打印"
                    color: "white"
                }
            }
        }

        Component {
            id: ingredientDelegate
            Item {
                width: container.width
                height: 24
                x: leftMargin

                Text {
                    id: ingredientNameText
                    width: 240
                    anchors.verticalCenter: parent.verticalCenter
                    text: ingredient
                    font.pointSize: 12
                    verticalAlignment: Text.AlignVCenter
                    color: "white"
                }

                Text {
                    width: 80
                    anchors.right: parent.right
                    anchors.verticalCenter: parent.verticalCenter
                    text: weight
                    font.pointSize: 12
                    horizontalAlignment: Text.AlignHCenter
                    verticalAlignment: Text.AlignVCenter
                    color: "white"
                }

                MouseArea {
                    anchors.fill: parent
                    onClicked: {
                        // Show the ingredient's detailed information
                        myIntro.state = "show"
                    }
                }
            }
        }

        Component {
            id: ingredientSection
            Item {
                width: container.width - leftMargin * 2
                height: 24
                x: leftMargin

                Rectangle {
                    anchors.fill: parent
                    radius: 5
                    color: "white"
                    opacity: 0.9
                }

                Text {
                    anchors.verticalCenter: parent.verticalCenter
                    text: section
                    font.pointSize: 14
                    verticalAlignment: Text.AlignVCenter
                    font.bold: true
                    color: "red"
                }
            }
        }

        ListModel {
            id: ingredientModel
            // 主材
            ListElement { ingredient:"鸡腿肉"; weight:"900公克"; catalog: "主材"; }
            // 辅材
            ListElement { ingredient:"干红辣椒"; weight:"40公克"; catalog: "辅材"; }
            ListElement { ingredient:"炸花生米"; weight:"75公克"; catalog: "辅材"; }
            // 配料
            ListElement { ingredient:"花椒粒"; weight:"2大匙"; catalog: "配料"; }
            ListElement { ingredient:"葱(切段)"; weight:"2根"; catalog: "配料"; }
            ListElement { ingredient:"蛋白"; weight:"1个"; catalog: "配料"; }
            ListElement { ingredient:"太白粉"; weight:"2大匙"; catalog: "配料"; }
            ListElement { ingredient:"酱油"; weight:"2大匙"; catalog: "配料";  }
            ListElement { ingredient:"米酒"; weight:"1茶匙"; catalog: "配料"; }
            ListElement { ingredient:"蒜末"; weight:"1/4茶匙"; catalog: "配料"; }
            ListElement { ingredient:"麻油"; weight:"1茶匙"; catalog: "配料"; }
            ListElement { ingredient:"糖"; weight:"半茶匙"; catalog: "配料";  }
            ListElement { ingredient:"白醋"; weight:"1茶匙"; catalog: "配料"; }
            ListElement { ingredient:"色拉油"; weight:"5杯"; catalog: "配料"; }
            ListElement { ingredient:"酱色"; weight:"1茶匙"; catalog: "配料"; }
            ListElement { ingredient:"盐"; weight:"2茶匙"; catalog: "配料";  }
            ListElement { ingredient:"太白粉水"; weight:"1大匙"; catalog: "配料"; }
        }

        ListView {
            id: container
            width: ingredientList.width
            height: 454
            clip: true
            interactive: false // Disable the scrolling
            model: ingredientModel
            delegate: ingredientDelegate

            section.property: "catalog"
            section.criteria: ViewSection.FullString
            section.delegate: ingredientSection
        }
    }

    IngredientIntro {
        id: myIntro
        width: 300
        height: 300
        anchors.centerIn: parent
    }
}
